<template>
  <div class="item">
    <!-- <h1>这是单个商品</h1> -->
    <img :src="item.img" alt="" />
    <p>{{ item.name }}</p>
    <span>{{ item.price }}</span>
    <button @click="del(item.id)">删除</button>
  </div>
</template>
<script>
export default {
  props: ["item"],
  // props:{
  //   item:Object
  // }
  methods: {
    del(id) {
      this.$emit("del", id);

      // this.$emit("del",this.item.id)
      // 如果id不传参也可以这么写
    },
  },
};
</script>
<style lang="scss">
.item {
  width: 48%;
  display: flex;
  flex-direction: column;
  img {
    width: 80%;
    height: 300px;
  }
}
</style>
